<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        const obj = {
            msg: 'hello'
        }
        const abc = {
            demo: 'hhh'
        }
        function fn(x, y) {
            console.log(this)
            return x + y
        }
        // fn.bind(obj, 参数列表)

        // 1. 改变this指向
        // 2. 有返回值，返回值是一个函数，这个函数里面的this指向的就是bind的第一个参数
        // 3. bind不会立即执行，需要手动调用执行

        const fun = fn.bind(obj, 1, 2)
        // const fun = function (x, y) {
        //     console.log(this)
        //     return x + y
        // }
        // console.log(fun)

        // 手动再调用一次
        // fun()
        const res = fun()
        console.log(res)

        /*==================================  call apply bind 的区别  ====================================*/

        // 1. 它们都可以改变this指向
        // 2. call接收的是参数列表，apply接收的是数组
        // 3. call和apply会立即执行，bind返回函数，需要手动调用
    </script>
</body>

</html>